﻿//Tab控制
Function.registerNameSpace("Page");

Page.Tab=function(buttonIDs,contentIDs,buttonCss,contentCss){
	this.tabs=[];
	this.commonDefaultButtonCss=null;
	this.commonActivedButtonCss=null;
	this.actionIndex=0;
	this.changeMethod="mouseover";
	this.mouseoversto=null;
	this.mouseoverstotime=200;

	//鼠标事件
	this._mouseover=EventOperate.createDelegate(this,this.__mouseover);
	this._click=EventOperate.createDelegate(this,this.__click);

	if(buttonCss!=null && buttonCss.length>=2){
		this.commonDefaultButtonCss=buttonCss[0];
		this.commonActivedButtonCss=buttonCss[1];
	}

	for(var i=0;i<buttonIDs.length;i++){
		if(i+1>contentIDs.length) break;
		this.AddItem(buttonIDs[i],contentIDs[i]);
	}
}

Page.Tab.prototype.AddItem=function(buttonID,contentID){
	var button=$$(buttonID);
	var content=$$(contentID);
	var o={};
	o.button=button;
	o.content=content;
	o.defaultButtonCss=this.commonDefaultButtonCss;
	o.activedButtonCss=this.commonActivedButtonCss;
	this.tabs.push(o);
	button.style.cursor="pointer";

	//动作
	//EventOperate.addEvent(button,"mouseover",this._mouseover);
	button.onmouseover=this._mouseover;
	button.onclick=this._click;
	var oThis=this;
	button.onmouseout=function(){clearTimeout(oThis.mouseoversto);}
}

Page.Tab.prototype.SetCommonButtonCss=function(dufaultCss,activedCss){

}

Page.Tab.prototype.SetButtonCss=function(index,defaultCss,activedCss){
	tabs[index].defaultButtonCss=defaultCss;
	tabs[index].activedButtonCss=activedCss;
}

Page.Tab.prototype.__mouseover=function(sender,e){
	if(this.changeMethod=="mouseover"&&this.tabs[this.actionIndex].button!=sender){
		if(this.mouseoversto) clearTimeout(this.mouseoversto);
		var Othis=this;
		this.mouseoversto=setTimeout(function(){Othis.__changeTab(sender);},this.mouseoverstotime);
	}
}

Page.Tab.prototype.__click=function(sender,e){
	if(this.changeMethod=="click") this.__changeTab(sender);
}

Page.Tab.prototype.__changeTab=function(obj){
	for(var i=0;i<this.tabs.length;i++){
		if(this.tabs[i].button==obj){
			this.tabs[i].button.className=this.tabs[i].activedButtonCss;
			this.tabs[i].content.style.display="";
			if(this.actionIndex!=i){
				var _h=EventOperate.getHandler(this,"TabChange");
				if(_h) {_h(this,i);}
			}
			this.actionIndex=i;
			this.tabs[i].button.blur();
		}
		else{
			this.tabs[i].button.className=this.tabs[i].defaultButtonCss;
			this.tabs[i].content.style.display="none";
		}
	}

}

Page.Tab.prototype.ChangeIndex=function(index){
	for(var i=0;i<this.tabs.length;i++){
		this.tabs[i].button.className=this.tabs[i].defaultButtonCss;
		this.tabs[i].content.style.display="none";
	}
	this.tabs[index].button.className=this.tabs[index].activedButtonCss;
	this.tabs[index].content.style.display="";
	this.actionIndex=index;
}

Page.Tab.prototype.SetChangeMethod=function(method){
	this.changeMethod=method;
}

Page.Tab.prototype.Add_TabChange=function(func){
	EventOperate.addHandler(this,"TabChange",func);
}



